<template>
    <el-dialog class="setButler" title="更改管家" :visible.sync="isDial" width="450px" :before-close="closeDialog">
        <div class="info">
            <span>服务时间：{{tabelRow.getHomeDate}}  {{tabelRow.serviceTime}}</span>
            <span>原服务管家：{{tabelRow.adminName}}</span>
        </div>
        <el-tabs v-model="activeName" @tab-click="handleClick">
            <el-tab-pane label="全职管家" name="1"></el-tab-pane>
            <el-tab-pane label="兼职管家" name="0"></el-tab-pane>
        </el-tabs>
        <el-table :data="gridData" border size='mini' max-height="400">
            <el-table-column property="date" label="选择" width="80">
                <template slot-scope="scope">
                    <el-radio v-model="radio" :label="scope.row.index"></el-radio>
                </template>
            </el-table-column>
            <el-table-column property="realName" label="管家" width="100"></el-table-column>
            <el-table-column property="serviceAreaName" label="服务区域"></el-table-column>
        </el-table>
        <div slot="footer" class="dialog-footer">
            <el-button size="mini" type="primary" @click="saveButler">保 存</el-button>
        </div>
    </el-dialog>
</template>
<script>
import { request } from "../../assets/request.js";
export default {
    data(){
        return{
            gridData:[{
                date:'2015-2-1',
                name:'张三',
                address:'杭州',
            }],
            isDial: false,
            activeName: '1',
            radio:'',
            tabelRow:''
        }
    },
    created(){
        let that=this
        this.$root.$on('setBut',(data)=>{
            this.isDial=true
            console.log(data)
            that.tabelRow=data
            this.selectAdmin()
        })
    },
    methods:{
        closeDialog(){
            this.isDial=false
        },
        handleClick(tab, event) {
            console.log(tab.name);
            this.activeName=tab.name
            this.selectAdmin()
        },
        selectAdmin(){
            let that=this
            let url = "order/work/times/admin";
            let tabelRow=that.tabelRow
            let obj={
                orderId:tabelRow.id,
                isFullTime:parseInt(this.activeName)
            }
            request.ajaxGet({
                url,
                that,
                params:obj,
                fn(res){
                    for(let i in res){
                        res[i].index= parseInt(i)+1
                    }
                    that.gridData=res
                }
            })
        },
        saveButler(){
            let that=this
            if(this.radio==''){
                return
            }
            let url='order/distribution'
            let tabelRow=this.tabelRow
            let time=tabelRow.serviceTime.split('~')
            console.log(tabelRow)
            let gridData=this.gridData
            let admin={}
            for(let i in gridData){
                if(this.radio==gridData[i].index){
                    admin=gridData[i]
                    break;
                }
            }
            console.log(admin)
            let params={
                adminId: admin.adminId,
                date: tabelRow.getHomeDate,
                endTime: time[1],
                orderId: tabelRow.id,
                startTime: time[0]
            }
            console.log(params)
            request.ajaxPost({
                url,
                that,
                type:'PUT',
                params,
                fn(res) {
                    that.isDial = false;
                    console.log(res)
                    that.$root.$emit("searchOrder",'no')
                    that.radio=''
                    // that.$root.$emit("page",'no')
                }
            });
        }
    }
}
</script>

<style lang="less" scoped>
.setButler{
    text-align: left;
    .info{
        background: #f5f5f5;
        line-height: 60px;
        margin-top: -20px;
        margin-bottom: 10px;
        margin-left: -20px;
        width: 100%;
        padding: 0 20px;
        border-top: 1px solid #eeeeee;
        span{
            margin-right: 15px;
        }
    }
}
</style>
